<template>
  <div class="header1">
    <span>创建时间</span>

    <el-date-picker
      @change="timefun"
      v-model="value1"
      type="daterange"
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
    ></el-date-picker>
    <span>接诊状态</span>
    <el-select @change="handleCommand" v-model="value" placeholder="请选择接诊状态">
      <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
    </el-select>

    <div>
      <el-input placeholder="请输入姓名搜索" v-model="input3" class="input-with-select">
        <el-button @click="loginp3" slot="append" icon="el-icon-search"></el-button>
      </el-input>
    </div>
  </div>
</template>
 

<script>
export default {
  data() {
    return {
      options: [
        {
          value: "0",
          label: "全部"
        },
        {
          value: "1",
          label: "待接诊"
        },
        {
          value: "2",
          label: "接诊中"
        },
        {
          value: "3",
          label: "已完成"
        }
      ],
      value: "",
      value1: "", //时间戳

      input3: ""
    };
  },
  methods: {
    timefun() {
      console.log(1);
      if (this.value1) {
        this.$emit("timesetfun", this.value1); //把时间数组发送
      } else {
        console.log(2),
          (this.value1 = [0, 0]),
          this.$emit("timesetfun", this.value1);
      }
    },
    // timefun2() {
    //   this.$emit("timesetfun2", this.value4);
    // },
    handleCommand() {
      this.$emit("grabbleState", this.value);
    },
    loginp3() {
      // console.log(this.input3);
      this.$emit("grabble", this.input3); //发送搜索值
    }
  }
};
</script>

<style lang="less" scoped>
.header1 {
  width: 1100px;
  align-items: center;
  justify-content: space-between;
  display: flex;
}
</style>